
import React, { Component } from 'react';
class Parent4 extends Component {
    // 1.0 父组件要定义 一个state属性 和一个方法
    state = { money: 0 }
    ReceiveMoney = (money) => {
        // 6.0 父组件的方法是给子组件进行回调的，同时要将传入的实参修改到父组件的状态属性moeny上
        this.setState({ money })
    }
    render() {
        return (<div>
            {/* 此时Child5 和 Child4是一个兄弟关系 */}
            {/* 1.0 需求：Child5 要给Child4进行传值  场景：Child5借1000块钱给Child4*/}
            {/* 2.0 将state属性传递给接收数据的子组件Child4 */}
            <Child4 moeny={this.state.money}></Child4>

            {/* 3.0 将ReceiveMoney这个方法的引用地址传递给给数据的组件Child5 */}
            <Child5 giveMoeny={this.ReceiveMoney}></Child5>
        </div>);
    }
}

export default Parent4;

class Child4 extends Component {
    state = {}
    render() {
        return (<div>
            {/* 5.0 由于接收数据的组件接收的是父组件的一个状态属性moeny，所以当父组件的状态属性moeny值发生改变的时候
            该子组件的页面就会重新刷新，因此可以显示出新数据 */}
            接收到Parent4的moeny：{this.props.moeny}
        </div>);
    }
}


class Child5 extends Component {
    state = {}
    render() {
        return (<div>
            {/* 4.0 给数据的组件需要调用父组件传入的方法，传入实参传递给父组件 */}
            <button onClick={() => { this.props.giveMoeny(1000) }}>借1000给child4</button>
        </div>);
    }
}

